import { useState, useEffect } from 'react';
import { tabbarStore } from '../mobx/store';
import { autorun } from 'mobx';

const useAutoHandleTabbar = () => {
  useEffect(() => {
    tabbarStore.hide();
    return () => {
      tabbarStore.show();
    };
  }, []);
};

const useShowBar = () => {
  const [showBar, setShowBar] = useState(true);
  useEffect(() => {
    let unsubscribe = autorun(() => {
      setShowBar(tabbarStore.tabbarShow);
    });
    return () => {
      unsubscribe();
    };
  }, []);

  return {
    showBar,
  };
};

export { useAutoHandleTabbar, useShowBar };
